<template lang="html">
  <div class="examine">
    <div class="breadNav">
      <el-breadcrumb separator="/" class="">
        <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item :to="{ path: '/hold' }">待办业务</el-breadcrumb-item>
        <el-breadcrumb-item>审核</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <div class="examineMenu">
      <el-steps :space="200" :active="state">
        <el-step title="等待处理"></el-step>
        <el-step title="处理中"></el-step>
        <el-step title="已办结"></el-step>
        <el-step title="已回访"></el-step>
      </el-steps>
      <div class="exslider">
        <template>
          <el-table
            :data="tableData1"
            style="width: 100%">
            <el-table-column
              prop="date"
              label="用户信息"
              width="120">
            </el-table-column>
            <el-table-column
              prop="name"
              label="">
            </el-table-column>
          </el-table>
        </template>
      </div>
      <div class="exslider">
        <template>
          <el-table
            :data="tableData2"
            style="width: 100%">
            <el-table-column
              prop="title"
              label="诉求信息"
              width="120">
            </el-table-column>
            <el-table-column
              prop="name"
              label="">
            </el-table-column>
          </el-table>
        </template>
      </div>
      <div class="exform">
        <el-form ref="form" label-width="80px">
          <div style="padding-bottom:20px">
            <el-button @click="adopt()">通过</el-button>
            <el-button @click="refuse()">拒绝</el-button>
          </div>
            <el-input type="textarea" :rows="3" v-model="rejectreason" placeholder="请输入拒绝原因" v-show="refuject"></el-input>
            <div class="exbtn" v-show="refuject">
              <el-button type="primary" @click="apply()">回复</el-button>
            </div>
        </el-form>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'examine',
  props: [
    'user',
    'custype'
  ],
  data() {
    return {
      state: 1,
      tableData1: [],
      tableData2: [],
      list:[],
      subText:'',
      appealbillbum:'',
      refuject:false,
      verifyflag:'',
      rejectreason:''
    }
  },
  methods:{
    adopt(){
      this.verifyflag = 1;
      this.rejectreason = ''
      this.verifyappeal()
    },
    refuse(){
      this.refuject = true;
    },
    apply(){
      this.verifyflag = 0;
      this.verifyappeal()
    },
    verifyappeal(){
      var data = {
        method:'VerifyAppeal',
        origin:'WarmAppealService',
        company:this.company,
        appealbillbum:this.appealbillbum,
        verifyflag:this.verifyflag,
        publisher:this.user,
        rejectreason:this.rejectreason
      }
      const _this = this;
      this.post(this.jholdUrl,data,function(res){
        if(res.Result == 0){
          _this.$alert('操作成功', '提示', {
            confirmButtonText: '确定',
            callback: action => {
              _this.$router.push('/hold')
            }
          });
        }
      })
    }
  },
  created() {
    let info = JSON.parse(localStorage.appealinfo);

    if (info.State == 0) { //工单状态进度 0提交诉求单 1审核通过 -1审核未通过 2已派工 3维修中 4待回访 5已结束
      this.state = 1
    } else if (info.State == 1 || info.State == -1 || info.State == 2 || info.State == 3) {
      this.state = 2
    } else if (info.State == 4) {
      this.state = 3
    } else if (info.State == 5) {
      this.state = 4
    }


    this.tableData1 = [ {
      date: '用户姓名',
      name: info.ContactPerson
    }, {
      date: '联系方式',
      name: info.ContactTel
    }, {
      date: '地址',
      name: (info.BuildingName == null || info.RoomNum == null)?'无':(info.BuildingName+' '+info.RoomNum)
    }, {
      date: '供热卡号',
      name: (info.CardNum == null)?'无':(info.CardNum)
    }, {
      date: '供热公司',
      name: info.CusName
    }, {
      date: '提交时间',
      name: info.AddTime
    }]

    this.AppealContent = info.AppealContent

    this.tableData2 = [ {
      title: '诉求类型',
      name: info.Type
    }, {
      title: '诉求项目',
      name: info.Item
    },{
      title: '描述',
      name: info.AppealContent
    }]

    this.appealbillbum = info.AppealNum

  }
}
</script>

<style lang="css">
.examineMenu{
  padding: 0 20px 20px 20px
}
.exslider{
  margin-top: 20px
}
.exform{
  margin-top: 20px
}
.exbtn{
  width: 100%;
  padding: 10px 0 60px 0
}
.exbtn button{
  float: right;
}
</style>
